<template>
  <div class="app-container">
    <el-row :gutter="20">
      <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">

        <!--卡片一-->
    <el-card class="box-card">

      <div class="text item">

          <el-form-item label="身份证号" prop="pati_code">
            <el-input
              v-model="queryParams.pati_code"
              placeholder="请输入身份证号名称"
              id="identityCard"
              clearable
              size="small"
              style="width: 350px"
            />
          </el-form-item>
        &nbsp; &nbsp; &nbsp;
          <el-button type="primary" icon="el-icon-search" size="mini" @click="getPatientID">加载身份证号</el-button>
          <el-button type="warning" icon="el-icon-search" size="mini" @click="getPatientInfo">加载患者信息</el-button>

      </div>
    </el-card>
     <br><br>
      <el-card class="box-card">
        <div  class="text item">
          <el-col :span="100" :xs="24">
            <!--患者信息-->
          <el-form-item label="身份证号" prop="pati_code">
            <el-input
              placeholder="身份证号"
              clearable
              id="idc"
              size="small"
              style="width: 240px"
              v-hasPermi="['seeDoctor:register:list']"
              @keyup.enter.native="handleQuery"
            />
          </el-form-item>
          <el-form-item label="患者姓名" prop="pati_name">
            <el-input
              id="pname"
              placeholder="请输入患者姓名"
              clearable
              size="small"
              style="width: 240px"
              v-hasPermi="['seeDoctor:register:list']"
              @keyup.enter.native="handleQuery"
            />
          </el-form-item>
          <el-form-item label="患者电话" prop="pati_phone">
            <el-input
              id="pphone"
              placeholder="请输入患者电话"
              clearable
              size="small"
              style="width: 240px"
              @keyup.enter.native="handleQuery"
            />
          </el-form-item>
          &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
          <el-form-item label="性别" prop="pati_sex">
            <label><input  type="radio" name="sex" value="0" id="isMale"/>男 </label>
            <label><input  type="radio" name="sex" value="1" id="isFemale"/>女 </label>
            <label><input  type="radio" name="sex" value="2" id="noman"/>未知</label>
          </el-form-item>
          <el-form-item label="出生日期" prop="pati_birthday">
            <el-date-picker id="pbith" format="yyyy-MM-dd" type="date" value-format="yyyy-MM-dd"
                            :style="{width: '100%'}" placeholder="请选择出生日期" clearable
                            v-model="value1"
            ></el-date-picker>
          </el-form-item>

          <el-form-item label="患者年龄" prop="pati_age">
            <el-input
              id="page"
              placeholder="请输入患者年龄"
              clearable
              size="small"
              style="width:220px"
              v-hasPermi="['seeDoctor:register:list']"
              @keyup.enter.native="handleQuery"
            />
          </el-form-item>
          <el-form-item label="地址信息" prop="pati_address">
            <el-input
              id="paddress"
              placeholder="请输入地址信息"
              clearable
              size="small"
              style="width: 300px"
              v-hasPermi="['seeDoctor:register:list']"
              @keyup.enter.native="handleQuery"
            />
          </el-form-item>


          </el-col>
        </div>
      </el-card>

        <br><br>

        <!--卡片二-->
        <el-card class="box-card">
          <div  class="text item">
            <div style="margin-top: 20px">
              <el-radio-group v-model="radio2" size="medium">
                <el-radio-button label="门诊 6元" ></el-radio-button>
                <el-radio-button label="门诊+病历本 7元"></el-radio-button>
                <el-radio-button label="急诊 8元"></el-radio-button>
                <el-radio-button label="急诊+病历本 9元"></el-radio-button>
              </el-radio-group>
            </div>

            <el-button style="margin-left: 90% ;margin-top: 5px" align="center" type="danger" icon="" size="big" @click="tijiao">挂号收费
            </el-button>
          </div>
        </el-card>
        <br><br>

        <!--卡片三-->
        <el-card class="box-card">
          <div class="text item">

            <!--查询科室-->
            <el-form :model="queryParams2" ref="queryForm" :inline="true" v-show="showSearch">
              <el-form-item label="所属科室" prop="depts_name">
                <el-input
                  v-model="queryParams2.depts_name"
                  placeholder="请输入科室名称"
                  clearable
                  size="small"
                  @keyup.enter.native="handleQuery"
                />
              </el-form-item>
              <el-form-item label="挂号类型" prop="reg_type">
                <el-select v-model="queryParams2.registrationType" placeholder="挂号类型" clearable size="small">
                  <el-option
                    v-for="dict in registrationTypeOptions"
                    :key="dict.dictValue"
                    :label="dict.dictLabel"
                    :value="dict.dictValue"
                  />
                </el-select>
              </el-form-item>

              <el-form-item label="挂号时段" prop="reg_time">
                <el-select v-model="queryParams2.registrationTime" placeholder="挂号时段" clearable size="small">
                  <el-option
                    v-for="dict in registrationTimeOptions"
                    :key="dict.dictValue"
                    :label="dict.dictLabel"
                    :value="dict.dictValue"
                  />
                </el-select>
              </el-form-item>

              <el-form-item label="挂号时间" prop="reg_rdate">
                <el-date-picker
                  v-model="value2"
                  type="date"
                  placeholder="选择日期时间">
                </el-date-picker>
              </el-form-item>
              <el-button type="warning" icon="el-icon-search" size="mini" @click="getList">搜索</el-button>

            </el-form>

            <!--表格展示科室信息-->
            <el-table
              v-loading="loading"
              :data="postList"
              @selection-change="handleSelectionChange"
            >
              <el-table-column type="selection" width="55" align="center" />
              <el-table-column prop="depts_id" label="科室id"></el-table-column>
              <el-table-column prop="depts_name" label="科室名称"></el-table-column>
              <el-table-column prop="depts_num" label="当前号数"></el-table-column>
            </el-table>
            <pagination
              v-show="total>0"
              :total="total"
              :page.sync="queryParams2.pageNum"
              :limit.sync="queryParams2.pageSize"
              @pagination="getList"
            />

          </div>
        </el-card>

        </el-form>
    </el-row>



  </div>
</template>

<script>


  import { findPatientInfo,listPost, findPatientID, listAllR ,listAllDepts, listDeptHos, tijiaoAll, tijiaoAll1} from "@/api/seeDoctor/registration";
  import { getToken } from "@/utils/auth";
  // import { treeselect } from "@/api/system/dept";
  import Treeselect from "@riophae/vue-treeselect";
  import "@riophae/vue-treeselect/dist/vue-treeselect.css";


  export default {
    name: "User",
    components: { Treeselect },

    data() {
      return {
        radio1: '6',
        radio2: '7',
        radio3: '8',
        radio4: '9',

          formData: {
          field101: 1,
        },
        deptDoctors:[],

          pickerOptions: {
              disabledDate(time) {
                  return time.getTime() > Date.now();
              },
              shortcuts: [{
                  text: '今天',
                  onClick(picker) {
                      picker.$emit('pick', new Date());
                  }
              }, {
                  text: '昨天',
                  onClick(picker) {
                      const date = new Date();
                      date.setTime(date.getTime() - 3600 * 1000 * 24);
                      picker.$emit('pick', date);
                  }
              }, {
                  text: '一周前',
                  onClick(picker) {
                      const date = new Date();
                      date.setTime(date.getTime() - 3600 * 1000 * 24 * 7);
                      picker.$emit('pick', date);
                  }
              }]
          },
          value1: '',
          value2: '',
        // 遮罩层
        loading: true,
        // 选中数组
        ids: [],
        // 非单个禁用
        single: true,
        // 非多个禁用
        multiple: false,
        // 显示搜索条件
        showSearch: true,
        // 总条数
        total: 0,
        // 用户表格数据
        registerList: null,
        // 弹出层标题
        title: "",
        // 部门树选项
        deptOptions: undefined,
        // 是否显示弹出层
        open: false,
        //科室数据字典
        hisDepts: [],
        dlevelOptions: [],
        dsexOptions: [],
        deptList: [],
        // 部门名称
        deptName: undefined,
        // 默认密码
        initPassword: undefined,
        // 日期范围
        dateRange: [],
        //挂号类型数据字典
        registerTypeOptions:[],
        //挂号时段数据字段
        registrationTimeOptions:[],
        // 状态数据字典
        statusOptions: [],
        //科室类型字典
        registrationTypeOptions: [],
        // 性别状态字典
        sexOptions: [],
        // 岗位选项
        postOptions: [],
        // 角色选项
        roleOptions: [],
        // 表单参数
        form: {},
        // 用户导入参数
        upload: {
          // 是否显示弹出层（用户导入）
          open: false,
          // 弹出层标题（用户导入）
          title: "",
          // 是否禁用上传
          isUploading: false,
          // 是否更新已经存在的用户数据
          updateSupport: 0,
          // 设置上传的请求头部
          headers: { Authorization: "Bearer " + getToken() },
          // 上传的地址
          url: process.env.VUE_APP_BASE_API + "/system/user/importData"
        },

        // 查询患者参数
        queryParams: {
            pati_code: undefined,
        },
        //查询科室参数
        queryParams2: {
          registrationType: undefined,
            depts_name:undefined,
          registrationTime:undefined
        },
        // 列信息
        columns: [
          { key: 0, label: `用户编号`, visible: true },
          { key: 1, label: `用户名称`, visible: true },
          { key: 2, label: `用户昵称`, visible: true },
          { key: 3, label: `部门`, visible: true },
          { key: 4, label: `手机号码`, visible: true },
          { key: 5, label: `状态`, visible: true },
          { key: 6, label: `创建时间`, visible: true }
        ],

      };
    },


    created() {
      this.getList();
      //挂号类型
      this.getDicts("patient_registration_time").then(response => {
        this.registrationTimeOptions = response.data;
      });
      //挂号类型
      this.getDicts("patient_registration_type").then(response => {
        this.registrationTypeOptions = response.data;
      });

      this.getDicts("sys_user_sex").then(response => {
        this.dsexOptions = response.data;
      });
      this.getDicts("sys_user_level").then(response => {
        this.dlevelOptions = response.data;
      });
      this.getConfigKey("sys.user.initPassword").then(response => {
        this.initPassword = response.msg;
      });
    },

    methods: {
      changedept(val){
        listDeptHos({ deptName1:val}).then(resp => {
          this.deptDoctors=resp.data;
          this.registerList = response.rows;
          this.total = response.total;
        })
      },


      // 挂号类型字典翻译
      registrationTypeFormat(row, column) {
        return this.selectDictLabel(this.registrationTypeOptions, row.registrationType);
      },



      change123(val) {
        document.getElementById("feiyong").value = "";
        var feiyong=0;
        listAllR().then(resp => {
          for(var i in resp.data){
            if(val==resp.data[i].registrationName){
              feiyong= resp.data[i].registrationPrice;
              document.getElementById("feiyong").value = feiyong+"￥";
            }
          }
        })

      },

      getAllDepts() {
        listAllDepts().then(resp => {
          this.hisDepts = resp.data;
        })
      },
      // 菜单状态字典翻译
      statusFormat(row, column) {
        return this.selectDictLabel(this.statusOptions, row.status);
      },
      // 等级级别字典翻译
      dlevelFormat(row, column) {
        return this.selectDictLabel(this.dlevelOptions, row.dlevel);
      },
      // 等级级别字典翻译
      dsexFormat(row, column) {
        return this.selectDictLabel(this.dsexOptions, row.dsex);
      },


      getAllR() {
        listAllR().then(resp => {
          this.registerTypeOptions = resp.data;
        })
      },
      //提交所有数据
      tijiao(row){
        // var card = this.queryParams.identityCard
        var card = document.getElementById("idc").value
        var type = this.queryParams2.registrationType
        var name2 = this.queryParams2.deptName
        var su = {card:card,type:type,name2: name2}
        console.log(su)
        console.log(card)
        console.log(type)
        const cid = row.did || this.ids;

        tijiaoAll1({ ddd:cid[0] }).then(resp => {
          if(resp.data==null){
            tijiaoAll(this.queryParams).then(response => {
              if(response.data==1){
                alert("挂号成功");
              }
            })
          }

        });


      },



      //加载身份证号
      getPatientID(){
        this.loading = true;
        findPatientID(this.queryParams).then(response=>{

          if (response.data.length==0){

            this.$message('患者不存在!');

          }else if(response.data.length>1){
            this.$message({
              message:'身份信息不详细，多患者匹配!',
              type:'warning'
            });
          }else{
        //加载成功后 把完成的身份证信息补充全
          document.getElementById("identityCard").value=response.data[0].pati_code;
            this.$message({
              message: '加载成功',
              type: 'success'
            });
          }
        })
      },
      /** 查询患者信息 */
      getPatientInfo() {
        this.loading = true;
        findPatientID(this.queryParams).then(response=>{

          if (response.data.length==0){

            this.$message('患者不存在!');

          }else if(response.data.length>1){
            this.$message({
              message:'身份信息不详细，多患者匹配!',
              type:'warning'
            });
          }else{
            //加载成功后 把完成的身份证信息补充全
            document.getElementById("idc").value=response.data[0].pati_code;
            document.getElementById("pname").value=response.data[0].pati_name;
            document.getElementById("pphone").value=response.data[0].pati_phone;
            if(response.data[0].pati_sex==0){
              document.getElementById("isMale").checked = true;
            }else if(response.data[0].pati_sex == 1){
              document.getElementById("isFemale").checked=true;
            }else {
              document.getElementById("noman").checked = true;
            }
            document.getElementById("pbith").value=response.data[0].pati_birthday;
            document.getElementById("page").value=response.data[0].pati_age;
            document.getElementById("paddress").value=response.data[0].pati_address;

            this.loading = false;
          }
        })

      },

      /** 查询科室列表 */
      getList() {
        this.loading = true;
        listPost(this.queryParams2).then(response => {
          this.postList = response.rows;
          this.total = response.total;
          this.loading = false;
        });
      },
      /** 查询部门下拉树结构 */
      getTreeselect() {
        treeselect().then(response => {
          this.deptOptions = response.data;
        });
      },
      // 筛选节点
      filterNode(value, data) {
        if (!value) return true;
        return data.label.indexOf(value) !== -1;
      },
      // 节点单击事件
      handleNodeClick(data) {
        this.queryParams.deptId = data.id;
        this.getList();
      },
      // 用户状态修改
      handleStatusChange(row) {
        let text = row.status === "0" ? "启用" : "停用";
        this.$confirm('确认要"' + text + '""' + row.userName + '"用户吗?', "警告", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }).then(function() {
          return changeUserStatus(row.did, row.status);
        }).then(() => {
          this.msgSuccess(text + "成功");
        }).catch(function() {
          row.status = row.status === "0" ? "1" : "0";
        });
      },
      // 取消按钮
      cancel() {
        this.open = false;
        this.reset();
      },
      // 表单重置
      reset() {
        this.form={
            pati_name: undefined,
            pati_phone: undefined,
            pati_birthday: undefined,
            pati_age: undefined,
            pati_code: undefined,
            pati_sex  : undefined,
            pati_address: undefined,
          registrationType: "0"
        };

        this.resetForm("form");
      },
      /** 搜索按钮操作 */
      handleQuery() {
        this.queryParams.page = 1;
        this.getList();
      },
      /** 重置按钮操作 */
      resetQuery() {
        this.dateRange = [];
        this.resetForm("queryForm");
        this.resetForm("queryForm2");
        this.handleQuery();
      },
      // 多选框选中数据
      handleSelectionChange(selection) {
        console.log(selection[0])

      },
      /** 新增按钮操作 */
      handleAdd() {
        this.reset();
        this.getTreeselect();
        getUser().then(response => {
          this.postOptions = response.posts;
          this.roleOptions = response.roles;
          this.open = true;
          this.title = "添加用户";
          this.form.password = this.initPassword;
        });
      },
      /** 修改按钮操作 */
      handleUpdate(row) {
        this.reset();
        this.getTreeselect();
        const did = row.did || this.ids;
        getUser(did).then(response => {
          this.form = response.data;
          this.postOptions = response.posts;
          this.roleOptions = response.roles;
          this.form.postIds = response.postIds;
          this.form.roleIds = response.roleIds;
          this.open = true;
          this.title = "修改用户";
          this.form.password = "";
        });
      },
      /** 重置密码按钮操作 */
      handleResetPwd(row) {
        this.$prompt('请输入"' + row.userName + '"的新密码', "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消"
        }).then(({ value }) => {
          resetUserPwd(row.did, value).then(response => {
            this.msgSuccess("修改成功，新密码是：" + value);
          });
        }).catch(() => {
        });
      },
      /** 提交按钮 */
      submitForm: function() {
        this.$refs["form"].validate(valid => {
          if (valid) {
            if (this.form.did != undefined) {
              updateUser(this.form).then(response => {
                this.msgSuccess("修改成功");
                this.open = false;
                this.getList();
              });
            } else {
              addUser(this.form).then(response => {
                this.msgSuccess("新增成功");
                this.open = false;
                this.getList();
              });
            }
          }
        });
      },
      /** 删除按钮操作 */
      handleDelete(row) {
        const dids = row.did || this.ids;
        this.$confirm('是否确认删除用户编号为"' + dids + '"的数据项?', "警告", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }).then(function() {
          return delUser(dids);
        }).then(() => {
          this.getList();
          this.msgSuccess("删除成功");
        })
      },
      /** 导出按钮操作 */
      handleExport() {
        const queryParams = this.queryParams;
        this.$confirm('是否确认导出所有用户数据项?', "警告", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }).then(function() {
          return exportUser(queryParams);
        }).then(response => {
          this.download(response.msg);
        })
      },
      /** 导入按钮操作 */
      handleImport() {
        this.upload.title = "用户导入";
        this.upload.open = true;
      },
      /** 下载模板操作 */
      importTemplate() {
        importTemplate().then(response => {
          this.download(response.msg);
        });
      },
      // 文件上传中处理
      handleFileUploadProgress(event, file, fileList) {
        this.upload.isUploading = true;
      },
      // 文件上传成功处理
      handleFileSuccess(response, file, fileList) {
        this.upload.open = false;
        this.upload.isUploading = false;
        this.$refs.upload.clearFiles();
        this.$alert(response.msg, "导入结果", { dangerouslyUseHTMLString: true });
        this.getList();
      },
      // 提交上传文件
      submitFileForm() {
        this.$refs.upload.submit();
      }
    }
  };
</script>
<style>
  .text {
    font-size: 14px;
  }

  .item {
    margin-bottom: 18px;
    line-height: normal;
  }

  .clearfix:before,
  .clearfix:after {
    display: table;
    content: "";
  }
  .clearfix:after {
    clear: both
  }

  .box-card {
    width: 100%;
  }
</style>






